@table-prefix: ~"w-table";

.@{table-prefix} {
  > table {
    display: table !important;
    margin: 0 !important;
    width: 100%;
    border-spacing: 0;
    border-collapse: collapse;
    tr > th, tr > td {
      border: 0;
      padding: 5px 8px;
      border-bottom: 1px solid #e8e8e8;
    }
    tr {
      background-color: transparent;
    }
    > caption {
      text-align: left;
      padding: 10px 8px;
    }
    > tbody > tr {
      transition: all .3s;
      &:hover, &:hover:nth-child(2n) {
        background-color: #efefef;
      }
      &:nth-child(2n) {
        background-color: #f9f9f9;
      }
    }
    > thead {
      > tr > th {
        font-weight: normal;
        padding: 8px;
      }
      > tr, tr:nth-child(2n) {
        background-color: #f6f9fb;
        border: transparent;
      }
    }
  }
  &-bordered {
    > table {
      tr > th, tr > td, > caption {
        border: 1px solid #dfe2e5;
      }
      > caption {
        border-bottom: 0;
      }
    }
  }
  &-bordered &-footer {
    border: 1px solid #dfe2e5;
    border-top: 0;
  }
  &-footer {
    background: #fafafa;
    padding: 10px 8px;
  }
}